/**
 * layout
 */
.body-wrapper {	
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	width: 790px;
	background-color:#FFFFFF;
}

.login-body-wrapper {
	background-color:transparent;
}

#main-container {
	padding:0 5px;
}

.home {
	background-image: url("../../img/bg/2.jpg");
	background-repeat:no-repeat;
	background-size:100%;
	
}

.lists {
	background-image: url("../../img/bg/ddd.jpg");

}

.view {
	background-image: url("../../img/bg/show.jpg");
		background-position:center;

}

.drug {
	background-image: url("../../img/bg/drug-back.jpg");
	background-repeat:no-repeat;
	background-size:100%;
	
}

.metro {
	background-color:#CCCCCC;
}

.opt1-4 {
	opacity: 0.25;
}

.full-width {
	width: 100%;
}
 
#top-bar {
	background-color: #333333;
}

.metro #top-bar a {
	color: #FFFFFF;
	display: inline-block;
}

#top-bar .user-id-image {
    width: 36px;
    height: 36px;
    color: inherit;
    background-color: #464646;
    margin: 0 0 0 10px;
    top: -10px;
    position: relative;
}

#top-bar .user-id-image [class*="icon-"] {
    padding: 10px;
}

/**
 * top container layout
 */
#top-container {
	border-bottom: 1px solid rgb(202, 202, 202);
	padding-bottom: 10px;
	margin-bottom: 10px;
}
#top-container #logo-image-container {
	margin: 5px 10px 0 0;
}
#top-container #logo-image-container img {
    width: 70px;
}

/**
 * bottom container layout
 */
#bottom-container {
	border-top: 1px solid #CACACA;
	color: #333333;
	margin-top: 10px;
	padding: 10px 5px;
}

/**
 * body container layout
 */
#body-container {
	min-height: 400px;       
}


/**
 * footer container layout
 */
#footer-container {
	padding: 5px 0;
	font-size: 10px;
	position: relative;
	text-align: center;
	width: 100%;
}

/**
 * home container layout
 */
.metro .home-container {
	background-repeat: no-repeat;
	background-image: url("../../img/bg/home.jpg");
	background-size: 780px auto;
	min-height: 400px;
}

.metro .home-container .tile-area-title {
    position: relative;
    top: 0px;
    left: 0px;
}

.metro .home-container .tile-group:first-child {
	margin-left: 0px;
}

.metro .home-container .tile-group {
	margin-right: 30px;
}

.metro .home-container .user-id {
	position: relative;
}

#login-form-container,
#patient-home-container,
#assistant-home-container,
#doctor-home-container,
#guest-home-container{
	min-height:450px;
	padding: 5px 0px 0 30px;
}

/**
 * doctor details container
 */
#doctor-info-show-container{
	background-image:url("../../img/bg/back-list.jpg");
}

#doctor-info-show-container .tile {
	background: none repeat scroll 0% 0% transparent;
}

#doctor-info-show-container .tile.tile-right {
	width: 245px;
}

.metro .home-container .tile .tile-content.icon-large img {
	width: 112px;
	height: 112px;
	line-height: 112px;
	left: 25%;
	top: 25%;
}

/**
 * user profile container
 */

.user-profile-info-container{
	height: 100%;	
}

.user-profile-info-container .user-profile-info {
	padding: 15px 0;
}

.user-profile-info-container .user-profile-info .subheader {
	min-height: 45px;
}

.user-profile-info-container .user-profile-info-block-container {
	margin: 0 35px;
}

.user-profile-info-container .user-profile-info-block {
	min-width: 115px;
	padding-right: 10px;	
}

.user-profile-info-container .user-profile-image {
	height: 100px;
}

.user-info-container .user-meta-info-container {
	text-align: center;
	padding: 5px 0;
}

.user-info-container .user-meta-info-container h6 {
	margin: 0;
	padding: 0;
}

.user-info-container .user-meta-info-container .subheader {
	margin-bottom: 10px;
}
/*
 *
 */
#contact-info-container h2 {
	text-align: right;
}

/**
 * columns
 */
.col-3 {
	width: 33%;
}

/**
 * list layout
 */
.list-content .list-icon-container .list-icon {
	width: 64px;
}
.list-content .list-meta {
	margin: 15px 0;
}

.list-content .list-meta .list-meta-block {
	padding: 10px;
}

/**
 * detail & form common layout
 */
.detail-container .menu-container,
.form-container .menu-container {
	border-bottom: 1px solid #EAEAEA;
	margin-bottom: 10px;
}

/**
 * form layout
 */
.form-container {
	
}

.form-container .error {
	color: #fa6800 !important;
}

.form-container .form-body-container {
	padding: 20px 40px 20px 60px;
	border: 1px #ccc solid;
	position: relative;
	margin: 0 0 10px 0;
	background-color: #fdfdfd !important;
	min-height: 100px;
	min-width: 50%;
}

.form-container .form-button-container .form-button.half-vertical {
    text-align: center;
    padding: 14px 0;
}

.form-container .form-button-container .form-button a {
	width: 100%;
	height: 100%;
	display: inline-block;
}

/**
 * detail layout
 */
.detail-container .top-navi-list .navi {
	border: 1px solid transparent;
	padding: 0 5px 0 18px;
}
.detail-container .top-navi-list .navi:HOVER {
	border: 1px solid #ddd;
	background: #eee;
}
.detail-container .meta-info-container {
    text-align: center;
    padding: 2% 0;
}
.detail-container .detail-inner-tile {
	min-width: 120px;
}
.detail-container .main-detail-tile-container {
	padding: 20px;
	border: 1px solid #eee;
	background: transparent;
}
.detail-container .main-detail-container {
}
.detail-container .main-detail-image {
	max-width: 75px;
	margin-right: 10px;
	line-height: 6.8rem;
}
.detail-container .main-detail-title {
	line-height: 6.8rem;
}

/* notify window */
.metro .notify-window-container {
	display: none;
}
.metro .notify-window {
	padding: 10px;
}
.metro .notify-window .notify-btn-container {
	margin-top: 10px;
}

/**
 * tiles layout
 */
.metro .tile.half-vertical {
    height: 55px;
}
.metro .tile.no-link:hover {
  	outline: 0;
  	cursor: default;
}
.metro .tile.full-width {
	width: 100%;
}

/**
 * appointment layout
 */
/*
#appointment-registration-form-container,
#appointment-list-date-container {
	width: 45%;
}
*/
.appointment-list-container .hour-info-container {
	background: none repeat scroll 0px 0px #EEE;
}
.appointment-list-container .hour-info-container.even {
    background: none repeat scroll 0px 0px #DDD;
}
.appointment-list-container .hour {
	padding: 60px 20px;
}
.appointment-list-container .minute {
	padding: 0 20px 0 0;
}
.appointment-list-container .patient {
	margin-right: 5px;
	overflow: hidden;
}
.appointment-list-container .appointment-btn-contaner {
	margin-top: 5px;
	display: inline-block;
}
.list-container .btn-container i,
.appointment-list-container .appointment-btn-contaner i {
	border-radius: 50%;
    padding: 6px;
    font-size: 12pt;
}
.appointment-list-container .patient-list-container {
	border: 1px solid #FFF;
	height: 40px;
	width: 230px;
	margin: 5px 5px 5px 0px;
	padding: 0px 5px;
}

.appointment-list-container .day-container .day {
	border: 1px solid #E6F5FC;
	padding: 20px;
	margin: 0 10px 0 0;
}

.appointment-list-container .day-container .day:HOVER {
	background: #E6F5FC;
}

/* appointment date selector style */
#appointment-date-select-container #appointment-date-picker {
	width: 180px;
}

#appointment-date-select-container #appointment-date-picker input[type="text"] {
	border: none;
	font-size: 2.2rem;
	font-weight: 300;
	letter-spacing: 0.01em;
}

#appointment-list-info-summary-container .tile.double {
	padding: 15px 0;
}

#month-appointment-list-container .calendar {
	width: 100%;
}
#month-appointment-list-container .calendar tr {
	height: 100px;
}
#month-appointment-list-container .calendar a {
	height: 100px;
	padding: 38px;
}
#month-appointment-list-container .calendar tr.calendar-subheader {
	height: 50px;
}
#month-appointment-list-container .calendar tr.calendar-header {
	height: 50px;
}
#month-appointment-list-container .calendar .calendar-actions {
	display: none;
}
#month-appointment-list-container .calendar tr.calendar-header a {
	padding: 15px;
	height: 50px;
}

/**
 * daily appointment list layout
 */
#daily-appointment-list-container {
	padding-left:30px;
	padding-right:30px;
	width:100%;
}

#daily-appointment-list-container .hour-info-container {
	padding-left:50px;
	padding-right:30px;
}

#daily-appointment-list-container .patient-list-container {
	padding-left:25px;
	width:450px;
}
/**
 * medicine layout
 */
.medicine-info-container .grid.fluid .row .span3 {
	width: 21% !important;
}
.medicine-info-container .medicine-data-container .row .span3 {
	padding: 5px 0;
}

/**
 * prescription selection layout
 */
#prescription-registration-selection-container {
	padding-top: 50px;
}
#prescription-registration-selection-container .tile {
	padding: 15px;
	width: 300px;
	height: 175px;
}

/**
 * stock layout
 */
#drugstock-detail-container.detail-container .detail-inner-tile {
	margin-right: 20px;
	min-width: 0;
}

ul.errorMessage {
	list-style-type: none;
    padding: 0px;
    margin: 0px;
}

ul.errorMessage li {
	background-color:#CCFF00;
	padding: 5px 0 5px 5px;
}

ul.errorMessage li span {
	color:#FF0000;
}

/**
 * list layout
 */
.list-container .listview-outlook {
	min-height:340px;
	background-image:url("../../img/bg/List-Back.jpg");
	background-repeat:no-repeat;
}

/**
 * common patient list layout
 */
#common-patient-list-container .list {
	cursor: default;
}
#common-patient-list-container .list-container .btn-container i {
	padding: 5px;
	font-size: 40px;
}
/**
 * drugstock detail layout
 */
#drugstock-detail-tile-container {
	min-height:400px;
	background-image:url("../../img/bg/details.jpg");
	padding-top: 20px;
	padding-left:5PX;
	background-repeat:no-repeat;
}

/**
 * doctor detail layout
 */
#doctor-info-show-container {
	min-height:400px;
	background-image:url("../../img/bg/details.jpg");
	background-repeat:no-repeat;
	background-position:top;
	padding-left:5px;
}

/**
 * patient detail layout
 */
.patient-detail-container,
#drugbrand-detail-header-container {
	min-height:350px;
	background-image:url("../../img/bg/details.jpg");
	background-repeat:no-repeat;
	background-position:top;
	padding-top:30px;
}

/**
 * drug detail layout
 */
#drug-detail-tile-container {
	min-height:350px;
	background-image:url("../../img/bg/details.jpg");
	background-repeat:no-repeat;
	background-position:top;
	padding-top:50px;
}

/**
 * assistant detail layout
 */
#assistant-info-show-container {
	min-height:400px;
	background-image:url("../../img/bg/details.jpg");
	background-repeat:no-repeat;
	background-position:top;
	padding-top:-20px;
}


/**
 * drug brand registration layout
 */
#drug-brand-registration-form-container {
	min-height:410px;
}

/**
 * assistant registration layout
 */
#assistant-registration-form-container {
	min-height:600px;
}

/**
 * prescription registration layout
 */
#prescription-registration-form{
	border:thick;
	padding-left:2px;
	min-height:700px;
}

#prescription-container{
	width:100%;
	
}

/**
 * drugstock edit layout
 */
#drug-stock-edit-form-container {
	min-height:500px;
}

/**
 * drugstock detail container
 */
#drugstock-detail-tile-container {
	padding-top:60px;
	padding-left:60px;
}

/**
 * delete layout
 */
#doctor-delete-detail-container,
#drugstock-delete-detail-container,
#patient-delete-detail-container,
#drug-delete-detail-container,
#drugbrand-delete-detail-container,
#assistant-delete-detail-container{
	min-height:400px;
	background-image:url("../../img/bg/delete.png");
}

/**
 * login page layout
 */
#userlogin-edit-form-container,
#userlogin-delete-detail-container {
	background-image:url("../../img/bg/login.jpg");
	background-repeat:no-repeat;
	min-height:500px;
}

#userlogin-edit-form{
	border:thick;
	width:45%;
	padding-right:20px;
	padding-top:20px;
}

#drugbrand-detail-tile-container {
	padding-left:10px;
	border:hidden;
	width:50%;
}

/**
 * pagination bar layout
 */
.pagination {
	padding-top:10px;
}

/**
 * appointment tile container
 */
.metro .tile .brand .badge, .metro .tile .tile-status .badge {
	font-size: 30px;
	bottom: 4px;
	border: 1px solid;
	border-radius: 19px;
	height: 39px;
	width: 39px;
	line-height: 24px;
}

/**
 * login form
 */

#userlogin-form {
	margin: 120px auto;
	width:380px;
}

/**
 * registration form
 */
#appointment-registration-form-container .registration-form label.error {
	background-color: #F2ED63 !important;
	display: block;
	min-width: 200px;
	height: auto;
	position: relative;
	background-color: #4390DF;
	padding: 20px;
	color: #FFFFFF;
}

#appointment-registration-form-container .registration-form label.error:before {
    top: 0px;
    left: 50%;
    margin-left: -5px;
    content: "";
    width: 10px;
    height: 10px;
    display: block;
    position: absolute;
    background-color: inherit;
    margin-top: -5px;
    transform: rotate(45deg);
}

#appointment-registration-form-container .listview-outlook .list-icon-container input[type="radio"] {
	display: inline-block;
	margin: 20px 10px 0px 0px;
}